<template>
    <div id="hotCenter_zccl_index_" class="container-fluid padding">
        <form action="">
            <fieldset class="layui-elem-field site-demo-button" id="operation">
                <legend>操作</legend>
                <div style="padding: 0px 10px 10px" action="">
                    <el-button type="success" class="is-round fa fa-search" :disabled="!operation.cx" @click="cx()">查询</el-button>
                    <el-button type="warning" class="is-round" :disabled="!operation.zccl" @click="zccl()">暂存处理</el-button>
                    <el-button type="primary" class="is-round fa fa-floppy-o" :disabled="!operation.bc" @click="bc()">保存</el-button>
                    <el-button type="primary" class="is-round fa fa-search" :disabled="!operation.cxkh" @click="cxkh()">查询客户</el-button>
                </div>
            </fieldset>
            <div id="details">
                <div class="layui-form-item">
                    <el-form :model="params" :inline="true" ref="params" label-width="100px" class="padding">
                        <el-form-item label="时间类型" prop="sjlx">
                            <el-select v-model="params.sjlx" style="width: 300px;">
                                <el-option value="" label=""></el-option>
                                <el-option value="0" label="最早进线时间">最早进线时间</el-option>
                                <el-option value="1" label="来电暂存时间">来电暂存时间</el-option>
                                <el-option value="2" label="待回访时间">待回访时间</el-option>
                            </el-select>
                        </el-form-item>
                        <el-form-item label="时间区间" prop="sjqj">
                            <el-date-picker style="width: 710px;"
                                    v-model="params.sjqj"
                                    type="datetimerange"
                                    placeholder="选择时间范围"
                                    value-format="timestamp"
                                    align="right">
                            </el-date-picker>
                        </el-form-item>
                        <el-form-item label="来电号码" prop="ldhm">
                            <el-input v-model="params.ldhm" style="width: 300px;"></el-input>
                        </el-form-item>
                        <el-form-item label="质询产品" prop="zxcp">
                            <el-input v-model="params.zxcp" style="width: 300px;"></el-input>
                        </el-form-item>
                        <el-form-item label="归属员工号" prop="yggh">
                            <el-input v-model="params.yggh" style="width: 300px;"></el-input>
                        </el-form-item>
                        <el-form-item label="客户名称" prop="khmc">
                            <el-input v-model="params.khmc" style="width: 300px;"></el-input>
                        </el-form-item>
                        <el-form-item label="客户质量" prop="khmc">
                            <el-select v-model="params.khzl" style="width: 300px;">
                                <el-option value="" label=""></el-option>
                                <el-option v-for="item in datas['客户质量']['children']" v-bind:key="item.id" v-bind:value="item.text" >{{item.text}}</el-option>
                            </el-select>
                        </el-form-item>
                        <el-form-item label=" ">
                            <el-button @click="$refs['params'].resetFields()">重置</el-button>
                        </el-form-item>
                    </el-form>
                </div>
            </div>
            <v-zccl ref="zccl" v-bind:cx_="cx_" v-bind:zccl_="zccl_" v-bind:params="params"></v-zccl>
            <v-lsjlydd ref="lsjlydd" v-bind:lsjlyddRefresh="lsjlyddRefresh" v-bind:params="params"></v-lsjlydd>
            <div class="layui-form-item" style="display: none">
                <div class="layui-input-block">
                    <button class="layui-btn" id="formSubmit" lay-submit lay-filter="formSubmit">立即提交</button>
                </div>
            </div>
        </form>
        <div style="display: none" id="khListContent">
            <v-kh></v-kh>
        </div>
    </div>
</template>
<script>
    import zccl from "./zccl.vue"
    import lsjlydd from "../hwzx/lsjlydd.vue"
    import kh from "../hwzx/kh.vue"
    export default {
        name: "zccl",
        components:{
            'v-zccl':zccl,
            'v-lsjlydd':lsjlydd,
            'v-kh':kh,
        },
        data() {
            return {
                cx_:false,
                zccl_:false,
                lsjlyddRefresh:false,
                operation: {//操作,控制按钮的显示与可以操作
                    cx: true,
                    zccl: false,
                    bc: false,
                    cxkh: true,
                    rwb: true,
                    jxzc: false,
                    gjcx: true,
                    gb: true,
                },
                datas: {//字典查找
                    '处理类型': {children: []},
                    '客户质量': {children: []},
                },
                params:{
                    id:"",
                    ldhm:"",//来电号码
                    other:"",
                    zxcp:"",
                    sjlx:"",
                    khmc:"",
                    yggh:"",
                    khzl:"",
                    sjqj:"",
                    keyup:true,//确定键按下了
                },
                index:"",
            }
        },
        beforeCreate:function () {
            this.$nextTick(function () {
                //查找字典数据，然后填充到数据框里面
                $("#reset").click(()=>{//重置
                    this.$cache_.flushData(this.params);
                })
                this.$message_.postTips(this,'','basic-information-system-dict/special-list',{CrmSystemDictSearch: {code_type_name: Object.keys(this.datas)}},null,(response)=>{
                    this.datas = response.data.data;
                })
            });
        },
        methods:{
            gb:function(){//关闭
                removeThisWorkTab(this);
            },
            bc:function () {//保存
                this.params.other = "hwzx";
                this.save("bc");
            },
            save:function(c){
                let zccl = this.$refs['zccl'];
                let lsjlydd = this.$refs['lsjlydd'];
                //保存暂存的数据
                this.$post('crm-hot-center-hwzx/'+c,{params:this.params,
                    khxx_data:zccl.$children[0].saveDatas!=undefined?zccl.$children[0].saveDatas:"",
                    wcjyy:lsjlydd.datas.wcjyy!=undefined?lsjlydd.datas.wcjyy:"",
                    wxyy:lsjlydd.datas.wxyy!=undefined?lsjlydd.datas.wxyy:"",
                    order:lsjlydd.saveOrderDatas!=undefined?lsjlydd.saveOrderDatas:"",
                    selectedProduct:JSON.stringify(lsjlydd.selectedProduct!=undefined?lsjlydd.selectedProduct:""),
                    lsjlyddClick:lsjlydd.lsjlyddClick!=undefined?lsjlydd.lsjlyddClick:0,
                })
                    .then((response) => {//这里使用了ES6的语法
                        if (response.data.res == 1) {//暂存处理成功，
                            this.$message({message:'保存成功',type:'success'})
                            this.$my_.revertData(this.operation)
                            layer.close(allIndex)
                            layui.table.render({
                                elem: "#zccl"
                                , url: burl + 'crm-hot-center-zccl/list' //数据接口
                                , toolbar: '' //开启工具栏，此处显示默认图标，可以自定义模板，详见文档
                                , title: ''
                                , where:{CrmHwzxZcclSearch:that.params}
                                , method:"post"
                                , height: 0
                                , limits: [10, 30, 60, 90]
                                , cols: [zccl.header]
                                , page: true //开启分页
                            });
                        }else{//失败
                            this.$message({message:'保存失败'+response.data.data[0],type:'error'})
                        }
                    }).catch((response) => {
                    consoleLog(response)
                });
            },
            cx:function () {//查询
                this.params.gsid = this.$cache_.getCookie('gsid');
                this.cx_ = !this.cx_;
                noCheckCache = true;
            },
            zccl:function () {//暂存处理
                this.zccl_ = !this.zccl_;//通知子进行列表刷新
                this.operation = {//操作,控制按钮的显示与可以操作
                    cx: false,
                    zccl: false,
                    bc: true,
                    cxkh: true,
                    rwb: true,
                    jxzc: true,
                    gjcx: false,
                    gb: false,
                }
            },
            gjcx:function () {//高级查询
                this.cx_ = !this.cx_;
            },
            cxkh:function(){//查询客户
                layer.open({
                    type: 1,
                    title:'查询客户列表',
                    fixed: false, //不固定
                    maxmin: true,
                    area: ['80%', '80%'], //宽高
                    shadeClose: true,
                    content:$('#khListContent'),
                });
            },
        },
    }
</script>